<template>
  <div>
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
      <el-tabs type="border-card">
        <el-tab-pane label="损伤情况">
          <div v-if="isCreate!=2">
            <el-button type="primary" @click="handleAdd">新 增</el-button>
            <el-button type="primary" @click="handleAddImg">上传图片</el-button>
            <el-button type="primary" @click="lookImg">查看图片</el-button>
          </div>
          <el-table
            ref="table"
            @row-click="childrenData"
            v-loading="loading"
            :data="userList"
            @selection-change="handleSelectionChange"
          >
            <el-table-column type="selection" v-if="isCreate!=2" width="55" align="center" />
            <el-table-column label="事故相关人/机械" prop="userId" align="center" />
            <el-table-column label="受损金额" align="center" />
            <el-table-column label="性别" align="center" prop="dictId" />
            <el-table-column
              label="年龄"
              align="center"
              prop="dictName"
              :show-overflow-tooltip="true"
            />

            <el-table-column
              label="备注"
              align="center"
              prop="dictName"
              :show-overflow-tooltip="true"
            />
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="事故分析">
          <el-form-item label="事故性质" prop="roleKey">
            <el-select
              :disabled="isCreate==2"
              v-model="queryParams.status"
              placeholder="请选择"
              clearable
              style="width: 240px"
            >
              <el-option
                v-for="dict in dict.type.sys_normal_disable"
                :key="dict.value"
                :label="dict.label"
                :value="dict.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="单位类型" prop="roleKey">
            <el-select
              :disabled="isCreate==2"
              v-model="queryParams.status"
              placeholder="请选择"
              clearable
              style="width: 240px"
            >
              <el-option
                v-for="dict in dict.type.sys_normal_disable"
                :key="dict.value"
                :label="dict.label"
                :value="dict.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="事故等级" prop="roleKey">
            <el-select
              :disabled="isCreate==2"
              v-model="queryParams.status"
              placeholder="请选择"
              clearable
              style="width: 240px"
            >
              <el-option
                v-for="dict in dict.type.sys_normal_disable"
                :key="dict.value"
                :label="dict.label"
                :value="dict.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="工伤类别" prop="roleKey">
            <el-select
              :disabled="isCreate==2"
              v-model="queryParams.status"
              placeholder="请选择"
              clearable
              style="width: 240px"
            >
              <el-option
                v-for="dict in dict.type.sys_normal_disable"
                :key="dict.value"
                :label="dict.label"
                :value="dict.value"
              />
            </el-select>
          </el-form-item>
          <el-form-item label="事故描述" prop="roleKey">
            <el-input
              :disabled="isCreate==2"
              v-model="queryParams.roleKey"
              placeholder="请输入"
              clearable
              class="hw"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
          <el-form-item label="事故分析" prop="roleKey">
            <el-input
              :disabled="isCreate==2"
              v-model="queryParams.roleKey"
              placeholder="请输入"
              clearable
              class="hw"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
        </el-tab-pane>
        <el-tab-pane label="责任追究">
          <div v-if="isCreate!=2">
            <el-button type="primary" @click="handleAdd">新 增</el-button>
            <el-button type="primary" @click="handleAddImg">附件</el-button>
          </div>
          <el-table
            ref="table"
            @row-click="childrenData"
            v-loading="loading"
            :data="userList"
            @selection-change="handleSelectionChange"
          >
            <el-table-column v-if="isCreate!=2" type="selection" width="55" align="center" />
            <el-table-column label="医疗费" prop="userId" align="center" />
            <el-table-column label="设备维修费" align="center" />
            <el-table-column label="货物损失" align="center" prop="dictId" />
            <el-table-column
              label="总损失"
              align="center"
              prop="dictName"
              :show-overflow-tooltip="true"
            />

            <el-table-column
              label="责任追究"
              align="center"
              prop="dictName"
              :show-overflow-tooltip="true"
            />
          </el-table>
        </el-tab-pane>
        <el-tab-pane label="事故教育">
          <el-form-item label="事故教育" prop="roleKey">
            <el-input
              :disabled="isCreate==2"
              v-model="queryParams.roleKey"
              placeholder="请输入"
              clearable
              class="hw"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
        </el-tab-pane>
        <el-tab-pane label="防范设施">
          <el-form-item label="防范设施" prop="roleKey">
            <el-input
              :disabled="isCreate==2"
              v-model="queryParams.roleKey"
              placeholder="请输入"
              clearable
              class="hw"
              @keyup.enter.native="handleQuery"
            />
          </el-form-item>
        </el-tab-pane>
      </el-tabs>
    </el-form>
    <el-dialog title="查看照片" :visible.sync="lookImgPop" width="60%" append-to-body>
      <lookImg type="2" @close="lookImgPop=false"></lookImg>
    </el-dialog>
    <el-dialog title="上传图片" :visible.sync="uploadImgPup" width="60%" append-to-body>
      <attachmentUploading type="1" @close="uploadImgPup=false"></attachmentUploading>
    </el-dialog>
  </div>
</template>
<script>
import addTabPan from "./addTabPan.vue";
import attachmentUploading from "./oss/attachmentUploading.vue";
import lookImg from "./img.vue";
import {
  listUser,
  getUser,
  delUser,
  addUser,
  updateUser,
  resetUserPwd,
  changeUserStatus,
  deptTreeSelect
} from "@/api/system/user";
export default {
  components: { attachmentUploading, lookImg, addTabPan },
  dicts: ["sys_normal_disable", "sys_user_sex"],
  props: {
    isCreate: {
      type: Number //0-新增 1-编辑   2-查看
    }
  },
  data() {
    return {
      uploadImgPup: false,
      lookImgPop: false,
      userList: [],
      loading: true,
      single: true,
      showSearch: true,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        userName: undefined,
        phonenumber: undefined,
        status: undefined,
        deptId: undefined
      }
    };
  },
  mounted() {
    this.getList();
  },
  methods: {
    lookImg() {
      this.lookImgPop = true;
    },
    handleAddImg() {
      this.uploadImgPup = true;
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.userId);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    childrenData(e) {
      console.log(e, "www");
    },
    getList() {
      this.loading = true;
      listUser(this.addDateRange(this.queryParams, this.dateRange)).then(
        response => {
          this.userList = response.rows;
          this.total = response.total;
          this.loading = false;
        }
      );
    },
    handleAdd() {
      this.open = true;
      this.getList();

      // this.reset();
      // getUser().then(response => {
      //   this.postOptions = response.data.posts;
      //   this.roleOptions = response.data.roles;
      //   this.open = true;
      //   this.title = "添加用户";
      //   this.form.password = this.initPassword;
      // });
    }
  }
};
</script>